<template>
  <div>
    <header class="header">
      <div class="title">
        <!-- <router-link to="/xqda"> -->
        <img src="../../assets/images/01_11.png" alt class="img_zuo" @click="fanhui_btn" />
        <!-- </router-link> -->
        <div class="btn-change" @click="jumpSwitch">切换</div>
        <!-- <div>{{ym_title}}</div> -->
        <div>监督检查计划</div>
      </div>
    </header>
    <div class="color">

      <div class="tjb_color">
        <div>
          <span class="tjb_hong"></span>
          <span class="cq">超期</span>
        </div>
        <div>
          <span class="tjb_huang"></span>
          <span class="jjcq">即将超期</span>
        </div>
      </div>
    </div>
    <div class="tjb_header">
      <div class="tjb">
        <div class="tjb_title">监督检查计划统计表</div>
        <div class="main_footer">
          <div class="main-list">
            <div class="main-wh">街道</div>
            <div class="main-wh sd">重点检查</div>
            <div class="main-wh sd">一般检查</div>
            <div class="main-wh sd">抽查</div>
            <div class="main-wh sd">小计</div>
          </div>
        </div>

        <div class="index">
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
          <div class="main-list">
            <div class="main-wh">合计</div>
            <div class="main-wh wh-col">50</div>
            <div class="main-wh wh-col">39</div>
            <div class="main-wh wh-col">6</div>
            <div class="main-wh wh-col">5</div>

          </div>
        </div>
      </div>
    </div>

  </div>
</template>
<script>
  export default {
    name: "yhzz_btn",
    data() {
      return {

      }
    },
    methods: {
      fanhui_btn() {

        // this.$router.push({
        //   path: '/index'
        // })
        this.$router.back()



      },
    }

  }
</script>
<style scoped>
  * {
    box-sizing: border-box;
  }

  .header {
    height: 1.8519rem;
    background: #007aff;
    padding-top: 0.8333rem;
    box-sizing: border-box;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 20;
    font-size: 0.388888rem;
  }

  .title {
    padding: 0 0.3704rem;
    display: flex;
    align-items: center;
    color: #fff;
  }

  .btn-change {
    position: absolute;
    left: 1.537037rem;
    font-size: 0.488888rem !important;
    bottom: 0px;
    top: 0.15rem;
    width: auto !important;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .title>div {
    width: 100%;
    font-size: 0.4444rem;
    text-align: center;
  }

  .img_zuo {
    width: 0.2593rem;
    height: 0.463rem;
  }

  .color {
    width: 97%;
    margin: auto;
    padding-top: 2rem;
  }

  .tjb_color {
    width: 50%;
    float: right;
    display: flex;
    justify-content: space-around;
  }

  .tjb_color>div {
    display: flex;

    justify-content: space-around;
  }

  .tjb_hong {
    width: 0.540741rem;

    height: 0.3rem;
    position: relative;
    top: 0.146296rem;

    background: #ff7373;
  }

  .tjb_huang {
    width: 0.540741rem;

    height: 0.3rem;
    position: relative;
    top: 0.146296rem;

    background: #eed826;
  }

  .tjb_header {
    margin-top: 0.6rem;
  }

  .tjb {
    /* padding-top: 2.185185rem; */



    background: #7ac0fe;
    width: 97%;
    margin: auto;
  }

  .tjb_title {
    text-align: center;
    color: #ffffff;
    padding: 0.292593rem;
  }

  .main_footer {
    /* position: fixed; */
    width: 100%;

    z-index: 999;

  }

  .main-list {
    display: flex;
    justify-content: space-around;

    border-top: 1px solid #ffffff;
  }

  /* .index {
    padding-top: 0.8rem;
  } */

  .main-wh {
    width: 20%;
    text-align: center;
    color: #ffffff;
    font-size: 0.388888rem;
    padding-top: 0.425926rem;
    padding-bottom: 0.425926rem;
    border-right: 1px solid #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .wh-col {
    color: #ffffff;
  }

  .sd {
    color: #ffffff;
  }
</style>